import React,{Component} from 'react'
import {HomeBox,HomeLeft,HomeRight,BackTop} from './style'
import Topic from './components/Topic'
import List from './components/List'
import Recommend from './components/Recommend'
import Download from './components/Download'
import Writing from './components/Writing'
import {connect} from 'react-redux'
import {getHomeData,changeShow} from '../../store/actionCreator'
class Home extends Component{
    constructor(){
        super();
    }
    componentDidMount(){
        this.props.getHomeData();
        window.addEventListener('scroll',this.props.changScrollTop)
    }
    backTop(){
        window.scrollTo(0,0)
    }
    render(){
        return(
            <React.Fragment>
                <HomeBox>
                    <HomeLeft>
                        <img className='img-banner' src='//upload.jianshu.io/admin_banners/web_images/4592/22f5cfa984d47eaf3def6a48510cc87c157bf293.png?imageMogr2/auto-orient/strip|imageView2/1/w/1250/h/540'></img>
                        <Topic></Topic>
                        <List></List>
                    </HomeLeft>
                    <HomeRight>
                        <Recommend></Recommend>
                        <Download></Download>
                        <Writing></Writing>
                    </HomeRight>
                </HomeBox>
                {this.props.show?<BackTop onClick={e=>{this.backTop()}}>回到顶部</BackTop>:null}
                {/* <BackTop onClick={e=>{this.backTop()}}>回到顶部</BackTop> */}
            </React.Fragment>
        )
    }
}
const mapStateToProps = (state)=>{
    return{
        show:state.get('home').get('show'),
    }
}
const mapDispatchToProps = (dispatch)=>{
    return{
        getHomeData(){
            var action = getHomeData();
            dispatch(action);
        },
        changScrollTop(){
            if(document.documentElement.scrollTop>300){
                var action = changeShow(true);
                dispatch(action);
            }else{
                var action = changeShow(false);
                dispatch(action);
            }
        }
    }
}
export default connect(mapStateToProps,mapDispatchToProps)(Home);

